<!--
 * @Description: 
 * @Author: dh
 * @Date: 2021-09-16 17:54:02
 * @LastEditors: dh
 * @LastEditTime: 2021-09-27 16:43:28
-->
<!doctype html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>web worker</title>
	</head>
	<!-- 
    多个页面可以共享一个worker.js
    使用 SharedWorker() 生成实例
    实例需要调用 port 才能接收和发送消息 
 -->

	<body>
		<button onclick="openSecond()">打开第二个页面</button>
		<script>
			const myWorker = new SharedWorker('SharedWorker.js');

			myWorker.port.postMessage('share1');

			// 方式一（直接给port绑定事件函数，不需要start方法）
			// myWorker.port.onmessage = function (e) {
			//     console.log(e);
			// }

			//方式2（只在一种情况下需要，那就是消息事件被addEventListener()方法使用。）
			myWorker.port.start();
			myWorker.port.addEventListener('message', function (e) {
				console.log(e);
			});

			function openSecond() {
				window.open('./SharedWorker-2.html');
			}
		</script>
	</body>
</html>
